<template>
  <basic-dialog :visible="show"
                title="修正产量"
                isShowClose
                :min-width="'760px'"
                :isShowInnerLoading="isShowInnerLoading"
                @close="show = false"
  >
    <q-table
      :data="tableData"
      :columns="tableColumns"
      row-key="number"
      id="table"
      class="myTable scroll stick-last-col inherit stick-last-row"
      :pagination.sync="pagination"
      style="max-height: 300px;margin: 0 20px 20px"
      :hide-bottom="!!tableData.length"
    >
      <template v-slot:body-cell="props">
        <q-td style="width: 50px" v-if="props.col.name==='operate'">
          <q-btn flat
                 color="primary"
                 v-if="!props.row.isSum"
                 :disable="props.row.orderStatus === Enums.PLAN_STATUS.CLOSED.value || !props.row.jobCount"
                 class="table-flat-btn"
                 @click="showDetail(props.row)">
            修正产量
          </q-btn>
        </q-td>
        <q-td :props="props" :class="{'disable-td': props.orderStatus === Enums.PLAN_STATUS.CLOSED.value}" v-else>
          {{props.value}}
        </q-td>
      </template>
    </q-table>
    <!--工单产量修正-->
    <work-order-correction-quantity ref="workOrderCorrectionQuantity"
                                    :show="workOrderCorrectionQuantityDialog.show"
                                    @submit="submit"
                                    @close="workOrderCorrectionQuantityDialog.show = false" />
  </basic-dialog>
</template>

<script>
import { getOrderDetail } from 'src/boot/job/process-order'
import workOrderCorrectionQuantity from '../work-order-correction-quantity'
import _ from 'lodash'

export default {
  name: 'amend-list',
  components: {
    workOrderCorrectionQuantity
  },
  data () {
    return {
      show: false,
      data: {},
      // 产量修正对话框
      workOrderCorrectionQuantityDialog: {
        show: false
      },
      tableData: [],
      // 不良明细表格数据列
      tableColumns: [
        { label: '加工产品', align: 'left', field: 'productNameNumber', name: 'productNameNumber' },
        { label: '派工数量', align: 'left', field: 'jobCount', name: 'jobCount' },
        { label: '完工数量', align: 'left', field: 'finishedCount', name: 'finishedCount' },
        { label: '不良数量', align: 'left', field: 'defectiveCount', name: 'defectiveCount' },
        { label: '操作', align: 'center', field: 'operate', name: 'operate' }
      ],
      // 不良明细表格分页器
      pagination: {
        rowsPerPage: 0
      },
      isShowInnerLoading: false
    }
  },
  methods: {
    getInfo (data) {
      this.show = true
      this.data = data
      this.$q.loading.show()
      // const res = dispatch.getOrderDetail()
      getOrderDetail(data.id).then(res => {
        let tableData = []
        this.deviceTypeCode = res.deviceTypeCode
        // this.orderInfo.deviceName = `${this.$utils.label(res.deviceName)}(${this.$utils.label(res.deviceNumber)})`
        if (res.workOrders.length) {
          res.workOrders.forEach(item => {
            item.productNameNumber = `${this.$utils.label(item.materialName)}(${this.$utils.label(item.materialNumber)})`
            item.processSort = `${item.processSort + 1}-${this.$utils.label(item.processName)}`
            item.orderNumber = this.$utils.label(item.orderNumber)
            item.orderBatch = this.$utils.label(item.orderBatch)
            const jobCount = this.$utils.label(item.jobCount, 0)
            const finishedCount = this.$utils.label(item.finishedCount, 0)
            item.processCount = this.$utils.label(item.processCount, 0)
            item.jobCount = jobCount
            item.finishedCount = finishedCount
            item.defectiveCount = item.orderStatus === this.Enums.PLAN_STATUS.CLOSED.value ? '--' : jobCount - finishedCount
          })
          tableData = _.cloneDeep(res.workOrders)
          const notClosed = tableData.filter(item => item.orderStatus !== this.Enums.PLAN_STATUS.CLOSED.value)
          const processCountSum = _.sumBy(notClosed, 'processCount')
          this.processCount = processCountSum
          const jobCount = _.sumBy(res.workOrders, 'jobCount')
          const finishedCount = _.sumBy(res.workOrders, 'finishedCount')
          const defectiveCount = _.sumBy(notClosed, 'defectiveCount')
          tableData.push({
            productNameNumber: '合计',
            jobCount: jobCount,
            finishedCount: finishedCount,
            defectiveCount: defectiveCount,
            processCount: processCountSum,
            isSum: true
          })
        }
        this.tableData = tableData
      }).finally(() => {
        this.$q.loading.hide()
      })
    },
    showDetail (data) {
      const dataInfo = {
        ...data,
        ...this.data
      }
      dataInfo.materialNames = this.data.materialNames[0]
      dataInfo.orderNumbers = this.data.orderNumbers[0]
      dataInfo.orderBatches = this.data.orderBatches[0]
      this.$refs.workOrderCorrectionQuantity.reset()
      this.workOrderCorrectionQuantityDialog.show = true
      this.$refs.workOrderCorrectionQuantity.assignment(dataInfo)
    },
    submit () {

    }
  }
}
</script>

<style scoped lang="stylus">
.stick-last-row .q-table tbody tr:last-child{
  >>>td{
    background-color #f9f9f9
  }
}
.disable-td{
  color #999
}

</style>
